<template>
  <e-dialog ref="dialog" :title="title" width="400px" @confirm="handleForm">
    <el-form :model="form" class="e-form" label-width="100px" label-position="left">
      <el-form-item label="材料名称：">
        <span>{{obj.name}}</span>
      </el-form-item>
      <el-form-item label="数量：">
        <el-input-number v-model="form.quantity" @change="changeQuantity" :min="1"></el-input-number>
      </el-form-item>
    </el-form>
  </e-dialog>
</template>

<script>
import eDialog from '@/components/dialog';
import {addProjectMaterial} from '@/utils/api';
export default {
  components: {eDialog},
  data () {
    return {
      projectId: '',
      projectSpaceId: '',
      title: '添加材料',
      form: {
        quantity: 1
      },
      obj: {}
    }
  },
  methods: {
    openDialog (data, projectId, projectSpaceId) {
      console.log(data)
      this.obj = data;
      this.projectId = projectId;
      this.projectSpaceId = projectSpaceId;
      this.form.quantity = 1;
      this.$refs.dialog.openDialog();
    },
    closeDialog () {
      this.$refs.dialog.closeDialog();
    },
    changeQuantity (e) {
      console.log(e)
    },
    handleForm () {
      const params = {
        projectId: this.projectId,
        projectSpaceId: this.projectSpaceId,
        materialId: this.obj.id,
        quantity: this.form.quantity
      }

      addProjectMaterial(params).then((res) => {
        if (res) {
          this.$message.success('添加成功');
          this.closeDialog();
          this.$emit('addProjectMaterialSuccess')
        }
      })
    }
  }
}
</script>